<template>
  <el-table
    :data="tableData"
    height="250"
    border
    style="width: 100%">
    <el-table-column
      prop="date"
      label="日期"
      width="180">
    </el-table-column>
    <el-table-column
      prop="time"
      label="排班时间"
      width="180">
    </el-table-column>
    <el-table-column
      prop="number"
      label="人数"
      width="180">
    </el-table-column>
    <el-table-column
      prop="people"
      label="排班员工">
    </el-table-column>
    <el-table-column
      label="操作"
      width="180">
      <el-button class="compile">编辑</el-button>
      <el-button type="danger" @click="Delete">删除</el-button>
    </el-table-column>
  </el-table>
</template>

<script>
    export default {
        name: "table_work",
      data() {
        return {
          tableData: [
            {date: new Date, time: '早班', number: '4', people: '张三，李四，王五，赵六'},
            {date: new Date, time: '晚班', number: '4', people: '老大，老二，老三，老四'},
            {date: new Date, time: '晚班', number: '4', people: '老大，老二，老三，老四'}
          ]
        }
      },
      methods:{
        Delete(){
          this.$confirm('此操作将永久删除该信息, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除'
            });
          });
        }
      }
    }
</script>

<style scoped>

</style>
